
<template>
  <el-dialog title="题目预览" :visible.sync="isShow" width="70%" height='70%' :before-close="handleclose">
   <el-row>
     <el-col :span='6'>
       【题型】:{{detailData.questionType==1? questionType[0].label:detailData.questionType==2? questionType[1].label:questionType[2].label}}
     </el-col>
     <el-col :span='6'>
       【编号】:{{detailData.id}}
     </el-col>
     <el-col :span='6'>
       【难度】:{{detailData.difficulty==0? difficulty[0].label : detailData.difficulty==1? difficulty[1].label:difficulty[2].label}}
     </el-col>
     <el-col :span='6'>
       【标签】:{{detailData.tags}}
     </el-col>
   </el-row>
   <p></p>
    <el-row>
       <el-col :span='6'>
       【学科】:{{detailData.subjectName}}
     </el-col>
     <el-col :span='6'>
       【目录】:{{detailData.directoryName}}
     </el-col>
     <el-col :span='6'>
       【方向】:{{detailData.direction}}
     </el-col>
   </el-row>
   <p></p>
  <hr/>
  <div >【题干】：</div>
  <p></p>
  <div style="color:blue" >{{html2Text(detailData.question)}}</div>
  <p></p>
  <p></p>
  <br>
  <span>{{detailData.questionType==1? '单选题' :'多选题'}}</span> 选项：  （以下选中的选项为正确答案）
   <p></p>
    <el-radio  :value="item.isRight" :label="1" v-for="item in this.detailData.options" :key="item.id" style="display:block" >{{item.code+'.'+item.title}}</el-radio>
  <hr/>
  <div>【参考答案】：<el-button type="danger" @click="isShowVideo=true">视频答案预览</el-button></div>
  <p></p>
  <video src="detailData.videoURL" controls width="50%" v-if="isShowVideo"></video>
   <p></p>
  <hr/>
  【答案解析】：{{html2Text(detailData.answer)}}
    <p></p>
  <hr/>
  <div>【题目备注】：{{detailData.remarks}}</div>
  <div slot="footer" class="dialog-footer">
      <el-button @click="handleclose" type="primary">关闭</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { difficulty, direction, questionType } from '@/api/hmmm/constants'
import { html2Text } from '@/utils/index.js'
export default {
  props: ['isShow', 'detailData'],

  data () {
    return {
      difficulty: difficulty,
      direction: direction,
      questionType: questionType,
      isShowVideo: false,
      checkList: []
    }
  },
  methods: {

    // 关闭弹窗
    handleclose () {
      this.$emit('update:isShow', false)
      this.isShowVideo = false
    },

    // 去除html标签
    html2Text (val) {
      return html2Text(val)
    }
  }
}
</script>

<style scoped >
.el-radio {
 line-height: 45px
}

</style>
